<template>
  <div>
    <span id="title"><b>平台科室管理</b></span>
    <div id="data_1">&nbsp;
      <i class="iconfont icon-querylist"></i>
      <span>科室列表</span>
      <el-button type="primary"
                 id="add">新增科室</el-button>
    </div>
    <div id="data_2">
      <template>
        <el-table :data="users"
                  border
                  style="width: 100%">
          <el-table-column prop=""
                           label="选择"
                           width="50"
                           align="center">
            <input type="checkbox">
          </el-table-column>
          <el-table-column prop="name"
                           label="科室名称"
                           width="120"
                           align="center">
          </el-table-column>
          <el-table-column prop="hospitalname"
                           label="医院名称"
                           width="120"
                           align="center">
          </el-table-column>
          <el-table-column prop="level"
                           label="级别"
                           width="50"
                           align="center">
          </el-table-column>
          <el-table-column prop="status"
                           label="状态"
                           width="70"
                           align="center">
          </el-table-column>
          <el-table-column prop="comment"
                           label="备注"
                           width="200"
                           align="center">
          </el-table-column>
          <el-table-column prop="uploader"
                           label="上传人"
                           width="100"
                           align="center">
          </el-table-column>
          <el-table-column prop="time"
                           label="添加时间"
                           width="200"
                           align="center">
          </el-table-column>
          <el-table-column prop=""
                           label="操作"
                           width="300"
                           align="center">
            <template slot-scope="scope">
              <!-- scope里面记录了当前行的下标，数据 -->
              <el-button type="success"
                         @click="info(scope)"
                         size="mini">查看下级</el-button>
              <el-button type="warning"
                         @click="update(scope)"
                         size="mini">编辑</el-button>
              <el-button type="danger"
                         @click="del(scope)"
                         size="mini">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </template>
      <div id="all">
        <input type="checkbox"
               id="checkall">全选
      </div>
      <el-button type="danger"
                 id="delall"
                 size="mini">批量删除</el-button>
      <div id="page">
        <el-pagination background
                       layout="prev, pager, next"
                       :total="100">
        </el-pagination>
      </div>
    </div>

  </div>
</template>

<script>
export default {
  name: 'PlatformDepartmentManagement',

  data() {
    let users = new Array()
    for (let i = 0; i < 10; i++) {
      users.push({
        time: '2020-02-07 21：00：00',
        name: '内科',
        hospitalname: '北京协和医院',
        level: '一级',
        uploader: '李四',
        status: '不显示',
      })
    }
    return {
      users,
      input: '',
      starttime: '',
      endtime: '',
      activeIndex: '0',
      value: '',
      pickerOptions: {
        shortcuts: [
          {
            text: '最近一周',
            onClick(picker) {
              const end = new Date()
              const start = new Date()
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
              picker.$emit('pick', [start, end])
            },
          },
          {
            text: '最近一个月',
            onClick(picker) {
              const end = new Date()
              const start = new Date()
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
              picker.$emit('pick', [start, end])
            },
          },
          {
            text: '最近三个月',
            onClick(picker) {
              const end = new Date()
              const start = new Date()
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
              picker.$emit('pick', [start, end])
            },
          },
        ],
      },
    }
  },
  methods: {
    chose: function () {
      let time = this.value
      console.log(time[0])
      console.log(time[1])
      console.log(this.input)
      this.starttime = time[0]
      this.endtime = time[1]
    },
    handleSelect(key) {
      console.log(key)
    },
  },
}
</script>

<style scoped>
#title {
  font-size: 30px;
}
#shaixuan_1 {
  /* border: 1px solid red; */
  margin-right: 50px;
  margin-top: 20px;
  height: 50px;
  font-size: 20px;
  line-height: 50px;
  background-color: rgb(241, 241, 241);
}
#shaixuan_2 {
  border: 1px solid rgb(216, 216, 216);
  margin-right: 50px;
  height: 100px;
}

#text {
  margin-top: 40px;
  margin-left: 20px;
  float: left;
}
#input {
  width: 200px;
  margin-top: 30px;
  float: left;
}
#date {
  float: left;
  margin-top: 30px;
  margin-left: 80px;
}
#button {
  float: left;
  margin-top: 30px;
  margin-left: 80px;
}

#data_1 {
  /* border: 1px solid red; */
  margin-right: 50px;
  margin-top: 20px;
  height: 50px;
  font-size: 20px;
  line-height: 50px;
  background-color: rgb(241, 241, 241);
}
#data_2 {
  border: 1px solid rgb(216, 216, 216);
  margin-right: 50px;
  height: 700px;
}

#data_2_2 {
  margin-top: 20px;
}

#all {
  margin-top: 40px;
  margin-left: 30px;
  float: left;
}
#delall {
  margin-top: 35px;
  margin-left: 30px;
  float: left;
}
#page {
  margin-top: 35px;
  margin-left: 150px;
  float: left;
}
#add {
  float: right;
  margin-top: 5px;
  margin-right: 170px;
}
</style>
